<template>
  <!-- 标签表格弹窗 -->
  <div class="">
    <el-dialog class="m_dialog" title="用户组管理" :visible.sync="tableDialogVisible" append-to-body :before-close="cancel" :close-on-click-modal="false">
      <div class='content-box'>
        <div class="box-heard edit">
          <el-button @click="handleAdd()" class="btn_primary" icon="el-icon-plus">
            新增用户组
          </el-button>
        </div>
        <div class="box-body">
          <el-table :data="riskList" style="width: 100%">
            <el-table-column prop="labelCode" label="用户组代号">
            </el-table-column>
            <el-table-column prop="labelName" label="用户组名称">
            </el-table-column>
            <el-table-column prop="" label="操作" width="100">
              <template slot-scope="scope">
                <div class="button-group">
                  <span type="text" class="tag_primary" size="small" @click="handleEdit(scope.row)">编辑</span>
                  <span type="text" class="tag_warning" size="small" @click="handleDelete(scope.row)">删除</span>
                </div>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!-- 弹窗 -->
        <!-- <RiskPointDialog  :riskRowObj="riskRowData" @tempFm="initTableList" :riskdialogVisible="isdialogVisible" @cancelDetail="cancelDetail"></RiskPointDialog> -->
      </div>
      <!-- <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFrom('FireFightingForm')" class="btn_primary">确 定</el-button>
      </div> -->
    </el-dialog>
    <TagManagement :descData="descData" :dialogVisible="dialogVisible" :title="title" @cancelDetail="cancelDetail" @initTableList="initTableList"></TagManagement>
  </div>
</template>
  <script>

import { addLabel, updateLabel, delLabel, getLabel, getLabelList } from "@/api"
import TagManagement from './TagManagement.vue'

export default {
  dicts: ['label_notice_type'],
  // 获取父级传递过来的参数
  props: ["tableDialogVisible"],
  components: {
    TagManagement,
  },
  data () {
    return {
      dialogVisible: false,
      // 标签列表
      riskList: [],
      // 新增编辑弹窗是否显示
      isdialogVisible: false,
      // 行数据
      riskRowData: {},
      // 标题
      title: undefined,
      // 行数据
      descData: undefined
    };
  },
  computed: {},
  watch: {
    // isdialogVisible: {
    //   handler(val) {
    //     this.isdialogVisible = val
    //   },
    // },
  },
  methods: {
    // 表格列表
    initTableList () {
      getLabelList().then(response => {
        this.riskList = response.rows
        this.$emit('getLabelList');
      })
    },
    // 新增用户信息
    handleAdd () {
      this.title = "新增用户组"
      this.descData = {}
      this.dialogVisible = true
    },
    // 修改
    handleEdit (row) {
      this.title = "修改用户组"
      this.descData = row
      this.dialogVisible = true
    },
    // 删除
    handleDelete (row) {
      const labelId = row.labelId
      this.$confirm("确认删除用户组吗？", "提示", {
        configButtonText: "确定",
        cancelButtonText: "取消",
      })
        .then(() => {
          delLabel([labelId]).then((response) => {
            this.initTableList()
            this.$message({
              message: "删除成功",
              type: "success",
            });
          });
          console.log("点击了确定");
        })
        .catch(() => {
          console.log("点击了取消");
        });
    },
    // 详情取消
    cancelDetail () {
      this.isdialogVisible = false;
    },
    // 关闭当前弹窗
    cancel () {
      this.$emit('cancel');
    },
    cancelDetail () {
      this.dialogVisible = false
    }
  },
  created () {
    this.initTableList()
    // console.log(this.rowData)
  },
  mounted () {

  },
}
  </script>
  
  <style lang='less' scoped>
.box-heard.edit {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 16px;
}
</style>